﻿@model WebApp.Models.MenuItem

<script type="text/javascript">
//初始化 MenuItem datagrid
var $menuitemsdg = $('#childmenuitems_datagrid');
$(() => {
    $menuitemsdg.datagrid({
            rownumbers: true,
            iconCls: 'fa fa-list',
            idField: 'Id',
            sortName: 'Id',
            sortOrder: 'asc',
            remoteFilter: true,
            singleSelect: true,
            method: 'get',
            onClickCell: menuitems_onClickCell,
            pagination: true,
            striped: true,
            columns: [[
		     /*{field:'Id',width:80 ,sortable:true,resizable:true }*/
			{
                 field:'Title', 
                 title:'<span class="required">@Html.DisplayNameFor(model => model.Title)</span>', 
                 width:260,
                 editor:{
                          type:'textbox',
                          options:{ prompt:'@Html.DisplayNameFor(model => model.Title)',required:true ,validType:'length[0,50]'  }  
                       },
                 sortable:true,
                 resizable:true 
			},
			{
                 field:'Description', 
                 title:'@Html.DisplayNameFor(model => model.Description)', 
                 width:260,
                 editor:{
                          type:'textbox',
                          options:{ prompt:'@Html.DisplayNameFor(model => model.Description)',required:false ,validType:'length[0,100]'  }  
                       },
                 sortable:true,
                 resizable:true 
			},
			{
                 field:'Code', 
                 title:'<span class="required">@Html.DisplayNameFor(model => model.Code)</span>', 
                 width:140,
                 editor:{
                          type:'textbox',
                          options:{ prompt:'@Html.DisplayNameFor(model => model.Code)',required:true ,validType:'length[0,20]'  }  
                       },
                 sortable:true,
                 resizable:true 
			},
			{
                 field:'Url', 
                 title:'<span class="required">@Html.DisplayNameFor(model => model.Url)</span>', 
                 width:260,
                 editor:{
                          type:'textbox',
                          options:{ prompt:'@Html.DisplayNameFor(model => model.Url)',required:true ,validType:'length[0,100]'  }  
                       },
                 sortable:true,
                 resizable:true 
			},
			{
                 field:'Controller', 
                 title:'@Html.DisplayNameFor(model => model.Controller)', 
                 width:260,
                 editor:{
                          type:'textbox',
                          options:{ prompt:'@Html.DisplayNameFor(model => model.Controller)',required:false ,validType:'length[0,100]'  }  
                       },
                 sortable:true,
                 resizable:true 
			},
			{
                 field:'Action', 
                 title:'@Html.DisplayNameFor(model => model.Action)', 
                 width:260,
                 editor:{
                          type:'textbox',
                          options:{ prompt:'@Html.DisplayNameFor(model => model.Action)',required:false ,validType:'length[0,100]'  }  
                       },
                 sortable:true,
                 resizable:true 
			},
			{
                 field:'IconCls', 
                 title:'@Html.DisplayNameFor(model => model.IconCls)', 
                 width:140,
                 editor:{
                          type:'textbox',
                          options:{ prompt:'@Html.DisplayNameFor(model => model.IconCls)',required:false   }  
                       },
                 sortable:true,
                 resizable:true 
			},
			{
               field:'IsEnabled', 
               title:'<span class="required">@Html.DisplayNameFor(model => model.IsEnabled)</span>', 
               width:120, 
               align:'center',
               editor:{
                      type:'booleaneditor',
                      options:{
                                 prompt:'@Html.DisplayNameFor(model => model.IsEnabled)', 
                                 required:true
                               } 
                      },
                formatter:booleanformatter,
                sortable:true, 
                resizable:true 
			},
			{
                field:'ParentId',
                title:'@Html.DisplayNameFor(model => model.ParentId)',
                width:160, 
                sortable:true, 
                resizable:true,
                formatter:function(value,row) {
				        return row.ParentTitle;
					},
			    editor:{
					    type:'combobox',
					    options:{
								prompt:'@Html.DisplayNameFor(model => model.ParentId)' ,
                                mode: 'remote',
								valueField:'Id',
								textField:'Title',
								method:'get',
								url:'/MenuItems/GetMenuItemsAsync',
								required:false
							}
						}
			},
            ]]
            });
            //初始化 datagrid filter
            $menuitemsdg.datagrid("enableFilter",[
				{
					  field: "Id",
					  type: "numberbox",
					  op:['equal','notequal','less','lessorequal','greater','greaterorequal']
				  },
				{
					  field: "IsEnabled",
					  type: "booleanfilter"
     			 },
		   {
				 field: "ParentId",
				 type:"combobox",
				 options:{
								valueField:"Id",
								textField:"Title",
								method:"get",
								url:"/MenuItems/GetMenuItemsAsync",
								onChange: function (value) {
								if (value == "") {
									$menuitemsdg.datagrid("removeFilterRule", "ParentId");
								} else {
									$menuitemsdg.datagrid("addFilterRule", {
										field: "ParentId",
										op: "equal",
										value: value
								});
							}
							$menuitemsdg.datagrid("doFilter");
						}
					}
		   },
		   ]);

});
    //datagrid CRUD method
    var menuitems_editIndex = undefined;
    //取消
    function menuitems_reject() {
		$menuitemsdg.datagrid("rejectChanges");
		menuitems_editIndex = undefined;
    }
    //重新加载数据
    function menuitems_reload() {
			if (endEditing()) {
				$menuitemsdg.datagrid("reload");
			}
	}
    //关闭编辑状态
	function menuitems_endEditing() {
			if (menuitems_editIndex === undefined) {
                return true; 
            }
			if ($menuitemsdg.datagrid("validateRow", menuitems_editIndex)) {

								var ed = $menuitemsdg.datagrid("getEditor", { index: menuitems_editIndex, field: "ParentId" });
				var parenttitle = $(ed.target).combobox("getText");
				var parentid = $(ed.target).combobox("getValue");
				$menuitemsdg.datagrid("getRows")[menuitems_editIndex]["ParentTitle"] =  parenttitle;
				$menuitemsdg.datagrid("getRows")[menuitems_editIndex]["ParentId"] = parentid;
								$menuitemsdg.datagrid("endEdit", menuitems_editIndex);
				menuitems_editIndex = undefined;
                return true;
			} else {
				return false;
			}
		}
    //单击列开启编辑功能
	function menuitems_onClickCell(index, field) {
			var _operates = ["_operate1", "_operate2", "_operate3", "ck"];
			if ($.inArray(field, _operates) >= 0) {
				return false;
			}
			if (menuitems_editIndex !== index) {
				if (menuitems_endEditing()) {
					$menuitemsdg.datagrid("selectRow", index)
							.datagrid("beginEdit", index);
                    menuitems_editIndex = index;
					var ed = $menuitemsdg.datagrid("getEditor", { index: index, field: field });
					if (ed) {
						($(ed.target).data("textbox") ? $(ed.target).textbox("textbox") : $(ed.target)).focus();
					}
				} else {
					$menuitemsdg.datagrid("selectRow", menuitems_editIndex);
				}
			}
		}
        //新增记录
    function menuitems_append() {
			if (menuitems_endEditing()) {
				//对必填字段进行默认值初始化
				$menuitemsdg.datagrid("insertRow", 
                               { index: 0,
                                  row: {
                                  
                                  ParentId:menuitemid
                                  }
                                });
				menuitems_editIndex = 0;
				$menuitemsdg.datagrid("selectRow", menuitems_editIndex)
						.datagrid("beginEdit", menuitems_editIndex);
			}
		}
    //删除编辑的行
	function menuitems_removeit() {
		if (menuitems_editIndex !== undefined) {  
			$menuitemsdg.datagrid("cancelEdit", menuitems_editIndex)
					           .datagrid("deleteRow", menuitems_editIndex);
			menuitems_editIndex = undefined;
        }
	}
    //删除选中的行
    function menuitems_deletechecked() {
            var rows = $menuitemsdg.datagrid("getChecked");
            if (rows.length > 0) {
                var id = rows.map(item => {
                    return item.Id;
                });
                $.messager.confirm("确认", "你确定要删除这些记录?",result => {
                    if (result) {
                        $.post("/MenuItems/DeleteCheckedAsync", { id: id })
                         .done(response => {
                            if (response.success) {
                                $menuitemsdg.datagrid("reload");
                            } else {
                                $.messager.alert("错误", response.err,"error");
                            }
                         });
                    }
                });  
            } else {
                $.messager.alert("提示", "请先选择要删除的记录!");
            }
      }
    //提交保存后台数据库
	function menuitems_accept() {
			if (menuitems_endEditing()) {
				if ($menuitemsdg.datagrid("getChanges").length) {
					var inserted = $menuitemsdg.datagrid("getChanges", "inserted");
					var deleted = $menuitemsdg.datagrid("getChanges", "deleted");
					var updated = $menuitemsdg.datagrid("getChanges", "updated");
					var item = new Object();
					if (inserted.length) {
						item.inserted = inserted;
					}
					if (deleted.length) {
						item.deleted = deleted;
					}
					if (updated.length) {
						item.updated = updated;
					}
					//console.log(JSON.stringify(item));
					$.post("/MenuItems/SaveDataAsync", item)
                     .done(response => {
						//console.log(response);
						if (response.success) {
							$.messager.alert("提示", "提交成功!");
							$menuitemsdg.datagrid("acceptChanges");
							$menuitemsdg.datagrid("reload");
						} else {
                           $.messager.alert("错误", response.err ,"error");
                        }
					  })
                      .fail((jqXHR, textStatus, errorThrown) => {
						//console.log(errorThrown);
						$.messager.alert("错误", "提交错误了!" + errorThrown,"error");

					  });
				}
			}
		}       
</script>


 